<template>
	<view>
		<view class="bj1">
			<span class="sj">讨论</span>
			<navigator url="./addtl">
			<view class="fl"><image src="../../static/indeimg/tianjia.png" style="width: 27px;height: 27px;"></image></view>
			</navigator>
			<navigator url="quanjuss">
				<view class="ss"><image src="../../static/img/sousuo.png" style="width: 25px;height: 25px;"></image></view>
			</navigator>
			<view style="width: 100%;height: 40px;position: relative;top: 90px;">
				<u-subsection :list="list" bgColor="#3ED2E2" inactiveColor="#fff" activeColor="#3ED2E2" fontSize="14.5px" :current="curNow" @change="sectionChange"></u-subsection>
			</view>
		</view>
		<view class="zs">
			<uni-card>
				<span style="color: #333333;font-size: 15px;"><b>奶茶究竟应该怎么扔？</b></span>
				<view style="width: 36px;height: 20px;background-color: #FE5E75;border-radius: 15px;display: inline-block">
					<span style="color: #FFFFFF;margin-left: 2px;">吐槽</span>
				</view>
				<br>
				<span style="font-size: 13px;">RT，一杯珍珠奶茶有珍珠有杯子有奶茶还有吸管，应该怎么分类才对？</span>
			</uni-card>
			<uni-card v-for="(item,index) in discusses" @click="gototl(item.discussId)">
				<span style="color: #333333;font-size: 15px;"><b>{{item.title}}</b></span>
				<view style="width: 36px;height: 20px;background-color: #FE5E75;border-radius: 15px;display: inline-block">
					<span style="color: #FFFFFF;margin-left: 2px;">热门</span>
				</view>
				<br>
				<span style="font-size: 13px;">{{item.contents}}</span>
			</uni-card>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				curNow:0,
				list: ['热门', '闲置', '求助', '吐槽', '社区'],
				discusses:[],
			}
		},
		onLoad() {
			this.sectionChange()
		},
		methods: {
			gototl(id){
				uni.navigateTo({
					url:'./tlxq?id='+id
				})
			},
			sectionChange(index) {
				this.curNow = index;
				uni.request({
					url:'http://localhost:9525/xkuser/ljp/gettlbytyle',
					method: 'GET',
				   data: {
						type: this.curNow,
				   },
				   dataType:'json',
				   success: (res) => {
						console.log(res)
						this.discusses=res.data.data.discusses
							
					},
				})	
			},
		}
	}
</script>

<style>
	.zs{
		width: 100%;
		height: 620px;
		background-color: #FFFFFF;
		margin-top: -95px;
	}
	.ss{
		width: 25px;
		height: 25px;
		/* background-image: url(../../static/img/fenlei.png); */
		/* background-color: #000000; */
		margin-left: 330px;
		position: absolute;
		top: 22px;
		
	}
	.fl{
		width: 25px;
		height: 25px;
		/* background-image: url(../../static/img/fenlei.png); */
		/* background-color: #000000; */
		margin-left: 280px;
		position: absolute;
		top: 20px;
		
	}
	.sj{
		font-family: '微软雅黑 Bold', '微软雅黑 Regular', '微软雅黑';
		    font-weight: 700;
		    font-size: 20px;
		    color: #FFFFFF;
		    margin-left: 15px;
			position: absolute;
			top: 20px;
	}
	.bj1{
			width:100%;
			height:468rpx;
			background-image: url(../../static/indeimg/xia.png);
			
		}
</style>
